<!DOCTYPE html>
    <html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/assets/css/plugins.css" />
    <link rel="stylesheet" href="/assets/css/style.css" />
    <link rel="stylesheet" href="/assets/css/css.css" />
    <link href="//unpkg.com/layui@2.9.3/dist/css/layui.css" rel="stylesheet">

</head>
<body>
<header class="ht-header full-width-hd" th:fragment="common_header">
    <div class="row">
        <nav id="mainNav" class="navbar navbar-default navbar-custom">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header logo">
                <div
                        class="navbar-toggle"
                        data-toggle="collapse"
                        data-target="#bs-example-navbar-collapse-1"
                >
                    <span class="sr-only">Toggle navigation</span>
                    <div id="nav-icon1"><span></span><span></span><span></span></div>
                </div>
                <!--            <a href="index.html"-->
                <!--              ><img-->
                <!--                class="logo"-->
                <!--                src="/assets/picture/logo1.png"-->
                <!--                alt=""-->
                <!--                width="119"-->
                <!--                height="58"-->
                <!--            /></a>-->
            </div>
            <!-- Collect the nav links, forms, and other content for toggling -->
            <div
                    class="collapse navbar-collapse flex-parent"
                    id="bs-example-navbar-collapse-1"
            >
                <ul class="nav navbar-nav flex-child-menu menu-left" style="margin-top: -40px">
                    <li class="hidden"><a href="#page-top"></a></li>
                    <li class="dropdown first">
                        <a
                                class="btn btn-default dropdown-toggle lv1"
                                data-toggle="dropdown"
                                data-hover="dropdown"
                                href="/index"
                        ><a href="/index">主页</a>
<!--                            <i class="fa fa-angle-down" aria-hidden="true"></i>-->
                        </a>
<!--                        <ul class="dropdown-menu level1">-->
<!--                            <li><a href="index.html">Home 01</a></li>-->
<!--                            <li><a href="">Home 02</a></li>-->
<!--                            <li><a href="homev3.html">Home 03</a></li>-->
<!--                        </ul>-->
                    </li>
                    <li class="dropdown first">
                        <a
                                class="btn btn-default dropdown-toggle lv1"
                                data-toggle="dropdown"
                                data-hover="dropdown"
                                href="/movies"
                        >
                            <a href="/movies">电影</a></a>
<!--                        <ul class="dropdown-menu level1">-->
                            <!-- <li class="dropdown"><a href="#">about us <i class="fa fa-caret-right" aria-hidden="true"></i></a><ul class="dropdown-menu level2"><li><a href="aboutv1.html">About Us 01</a></li><li><a href="aboutv2.html">About Us 02</a></li></ul></li>-->
<!--                            <li><a href="moviegrid.html">Movie grid</a></li>-->
<!--                            <li><a href="moviegridfw.html">movie grid full width</a></li>-->
<!--                            <li><a href="movielist.html">Movie list</a></li>-->
<!--                            <li class="it-last">-->
<!--                                <a href="moviesingle.html">Movie single</a>-->
<!--                            </li>-->
<!--                        </ul>-->
                    </li>
                    <li class="dropdown first">
                        <a
                                class="btn btn-default dropdown-toggle lv1"
                                href="/movieecharts"> <a href="/movieecharts">大数据</a>
                             </a>

                    </li>
                    <li class="dropdown first">
                        <a
                                class="btn btn-default dropdown-toggle lv1"
                                data-toggle="dropdown"
                                data-hover="dropdown"
                                href="/movieblog"
                        >
                            <a href="/movieblog">最新电影资讯</a></a>
<!--                        <ul class="dropdown-menu level1">-->
<!--                            <li><a href="bloglist.html">blog List</a></li>-->
<!--                            <li><a href="bloggrid.html">blog Grid</a></li>-->
<!--                            <li class="it-last">-->
<!--                                <a href="blogdetail.html">blog Detail</a>-->
<!--                            </li>-->
<!--                        </ul>-->
                    </li>
                    <li class="dropdown first">
                        <a
                                class="btn btn-default dropdown-toggle lv1"
                                data-toggle="dropdown"
                                data-hover="dropdown"
                        >
                            <a href="/user/profile" th:unless="${session.user==null}">我的</a></a>
<!--                        <ul class="dropdown-menu level1">-->
<!--                            <li>-->
<!--                                <a href="userfavoritegrid.html">user favorite grid</a>-->
<!--                            </li>-->
<!--                            <li>-->
<!--                                <a href="userfavoritelist.html">user favorite list</a>-->
<!--                            </li>-->
<!--                            <li><a href="userprofile.html">user profile</a></li>-->
<!--                            <li class="it-last"><a href="userrate.html">user rate</a></li>-->
<!--                        </ul>-->
                    </li>
                    <li class="dropdown first">
                        <a
                                class="btn btn-default dropdown-toggle lv1"
                                href="/admin/login"> <a href="/admin/login">后台管理系统</a>
                        </a>

                    </li>
                </ul>

                <ul class="nav navbar-nav flex-child-menu menu-right">
<!--                    <li class="dropdown first">-->
<!--                        <a-->
<!--                                class="btn btn-default dropdown-toggle lv1"-->
<!--                                data-toggle="dropdown"-->
<!--                                data-hover="dropdown"-->
<!--                        >-->
<!--                            pages <i class="fa fa-angle-down" aria-hidden="true"></i-->
<!--                        ></a>-->
<!--                        <ul class="dropdown-menu level1">-->
<!--                            <li><a href="landing.html">Landing</a></li>-->
<!--                            <li><a href="404.html">404 Page</a></li>-->
<!--                            <li class="it-last">-->
<!--                                <a href="comingsoon.html">Coming soon</a>-->
<!--                            </li>-->
<!--                        </ul>-->
<!--                    </li>-->
<!--                    <li><a href="#">Help</a></li>-->
                        <li class="loginLink" th:if="${session.user==null}"><a href="#">登陆</a></li>
                        <li class="btn signupLink" th:if="${session.user==null}"><a href="#">注册</a></li>
                </ul>
            </div>
            <!-- /.navbar-collapse -->
        </nav>
        <!-- search form -->
    </div>
</header>

<div class="login-wrapper" id="login-content" th:fragment="login-content">
    <div class="login-content">
        <a href="#" class="close">x</a>
        <h3>登陆</h3>
        <form method="post">
            <div class="row">
                <label for="username"
                >用户名:<input
                        type="text"
                        name="username"
                        id="username"
                        placeholder=""
                        required="required"
                /></label>
            </div>
            <div class="row">
                <label for="password">
                    密码:<input
                        type="password"
                        name="password"
                        id="password"
                        placeholder=""
                        required="required"
                /></label>
            </div>
<!--            <div class="row">-->
<!--                <div class="remember">-->
<!--                    <div>-->
<!--                        <input-->
<!--                                type="checkbox"-->
<!--                                name="remember"-->
<!--                                value="Remember me"-->
<!--                        /><span>Remember me</span>-->
<!--                    </div>-->
<!--                    <a href="#">Forget password ?</a>-->
<!--                </div>-->
<!--            </div>-->
            <div class="row"><button type="button" id="login-btn">Login</button></div>
        </form>
<!--        <div class="row">-->
<!--            <p>Or via social</p>-->
<!--            <div class="social-btn-2">-->
<!--                <a class="fb" href="#"-->
<!--                ><i class="ion-social-facebook"></i>Facebook</a-->
<!--                ><a class="tw" href="#"-->
<!--            ><i class="ion-social-twitter"></i>twitter</a-->
<!--            >-->
<!--            </div>-->
<!--        </div>-->
    </div>
</div>
<div class="login-wrapper" id="signup-content" th:fragment="signup-content">
    <div class="login-content">
        <a href="#" class="close">x</a>
        <h3>注册</h3>
        <form method="post" action="/moviesignup">
            <div class="row">
                <label for="username-2"
                >用户名:<input
                        type="text"
                        name="username"
                        id="username-2"
                        placeholder=""
                        required="required"
                /></label>
            </div>
            <div class="row">
                <label for="email-2">
                    邮箱:<input
                        type="email"
                        name="email"
                        id="email-2"
                        placeholder=""
                        required="required"
                /></label>
            </div>
            <div class="row">
                <label for="password-2">
                    密码:<input
                        type="password"
                        name="password"
                        id="password-2"
                        placeholder=""
                        required="required"
                /></label>
            </div>
            <div class="row">
                <label for="repassword-2">
                    确认密码:<input
                        type="password"
                        name="password"
                        id="repassword-2"
                        placeholder=""
                        required="required"
                /></label>
            </div>
            <div class="row"><button type="submit" >注册</button></div>
        </form>
    </div>
</div>

<div class="user-information" th:fragment="user-sidbar">
    <div class="user-img">
        <a href="#"
        ><img src="/assets/picture/user-img.png" th:src="${session.user.getImg()}" alt="" /><br />
        </a>
        <!--                <a href="#" class="redbtn">Change avatar</a>-->
    </div>
    <div class="user-fav">
        <p>账户信息</p>
        <ul>
            <li class="active"><a href="/user/profile">个人简介</a></li>
            <li><a href="/user/favo">个人收藏</a></li>
            <li><a href="/user/rate">个人评价</a></li>
        </ul>
    </div>
</div>


<script src="//unpkg.com/layui@2.9.3/dist/layui.js"></script>
<script src="/assets/js/jquery.js"></script>
<script src="/assets/js/plugins.js"></script>
<script src="/assets/js/plugins2.js"></script>
<script src="/assets/js/custom.js"></script>
<script src="/assets/js/common.js"></script>

<script>
    $(document).ready(function(){
        // Bind click event to the login button
        $('#login-btn').click(function(){
            // Get username and password input values
            var username = $('#username').val();
            var password = $('#password').val();

            // Make AJAX request to the backend
            $.ajax({
                type: 'POST',
                url: '/movielogin',
                data: {
                    username: username,
                    password: password
                },
                success: function(response){
                    // Handle success response
                    console.log(response);
                    // You can redirect or show a success message here
                },
                error: function(xhr, status, error){
                    // Handle error response
                    console.error(xhr.responseText);
                    // You can show an error message to the user here
                }
            });
        });
    });
</script>
</body>
</html>